-
Notifications
You must be signed in to change notification settings - Fork 158
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
[full-ci] Show sharees as avatars #5758
[full-ci] Show sharees as avatars #5758
Conversation
Thanks for opening this pull request! The maintainers of this repository would appreciate it if you would create a changelog item based on your changes. |
29ed1da
to
2444c2a
Compare
2444c2a
to
679b2ca
Compare
Results for oC10iPhoneNotifications https://drone.owncloud.com/owncloud/web/18746/44/1 |
89a1fa6
to
2e90b87
Compare
Results for oC10SharingInternalGroupsSharingIndicator https://drone.owncloud.com/owncloud/web/18768/24/1
|
Results for oC10IntegrationApp1 https://drone.owncloud.com/owncloud/web/18768/65/1
|
Results for oC10SharingExternalRoot https://drone.owncloud.com/owncloud/web/18768/40/1
|
@paulcod3 I changed the merge target branch, please rebase on #5770 (motivation for this is outlined there). You can then use the ODS 10.0.0, including the new avatars-component Also, please squash on merge 😉 |
bc62c4f
to
e90131c
Compare
> | ||
<li v-for="collaborator in collaborators" :key="collaborator.key"> | ||
<h2 class="shared-with-label" v-text="sharedWithLabel" /> | ||
<oc-avatars |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
No clue how the CI got that green if you're referencing a component the current version of ODS doesn't even know about 🤔
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
oh that is true lol
e90131c
to
144706c
Compare
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I'm afraid there's some stuff that doesn't work with this solution, sorry.
- the click handler on the div only works for mouse users. that's not accessible and not keyboard power user compatible.
- there is no way of closing the people list again
- I'd expect the avatars to be invisible when the list is expanded
I think for accessibility reasons the OcAvatars
component needs to have a type prop to distinguish if it's a presentational element or an interactive element. If it's interactive it needs to be an oc-button
with appearance="raw"
so that it's focusable and usable with both keyboard and mouse. Needs another PR in ODS, sorry :-(
packages/web-app-files/src/components/SideBar/Shares/FileShares.vue
Outdated
Show resolved
Hide resolved
packages/web-app-files/src/components/SideBar/Shares/FileShares.vue
Outdated
Show resolved
Hide resolved
packages/web-app-files/src/components/SideBar/Shares/FileShares.vue
Outdated
Show resolved
Hide resolved
packages/web-app-files/src/components/SideBar/Shares/FileShares.vue
Outdated
Show resolved
Hide resolved
collaborators_avatar() { | ||
const result = [] | ||
console.log(this.collaborators) | ||
this.collaborators.forEach(c => result.push({ ...c.collaborator, shareType: c.shareType })) |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Instead of building a result in a const, you can just
return this.collaborators.map(c => {
...c.collaborator,
shareType: c.shareType
})
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
nope the '...' doesnt work on map
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Why? The following works fine:
collaborators_avatar() {
return this.collaborators.map(c => {
return {
...c.collaborator,
shareType: c.shareType
}
})
},
Why is the computed prop name in snake case by the way? 🤔
packages/web-app-files/src/components/SideBar/Shares/FileShares.vue
Outdated
Show resolved
Hide resolved
packages/web-app-files/src/components/SideBar/Shares/FileShares.vue
Outdated
Show resolved
Hide resolved
Results for oC10SharingExternalRoot https://drone.owncloud.com/owncloud/web/18909/40/1
|
Results for oC10Files1 https://drone.owncloud.com/owncloud/web/18909/12/1
|
…cloud/web into show-sharees-as-avatar-group
aaa1231
to
3a529ab
Compare
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Nice! 🚀
Please squash on merge 😬 |
Results for oC10SharingPublicManagement https://drone.owncloud.com/owncloud/web/18919/34/1
|
Please retry analysis of this Pull-Request directly on SonarCloud. |
* WIP * WIP * fixed styling * fixed open people panel * fixed linting * changed to RC ODS version * hide shredwith label when no sharees * remove dev leftover * refactored raw button around ocavatars * added closing mechanism * removed copy pasta id * addressed PR issues * fixed PR issues * fixed tooltip, alignment * fixed PR issues * removed aria-hidden * fixed alignment
* WIP * WIP * fixed styling * fixed open people panel * fixed linting * changed to RC ODS version * hide shredwith label when no sharees * remove dev leftover * refactored raw button around ocavatars * added closing mechanism * removed copy pasta id * addressed PR issues * fixed PR issues * fixed tooltip, alignment * fixed PR issues * removed aria-hidden * fixed alignment
Description
See #5736
Types of changes
Checklist: